@mixin basics($name,$property){
    @for $i from 1 through 20 {
          
         @if $name == hei {
              .#{$name}-#{$i}{
                        #{$property}: $i * 10px; 
              } 
          }@else if $name == wid {
              .#{$name}-#{$i}{
                        #{$property}: $i * 5%; 
              } 
          }@else if $name == fz {
              .#{$name}-#{$i}{
                    #{$property}: $i * 5px; 
          }
          }@else if $name == lh {
            .#{$name}-#{$i}{
                      #{$property}: $i * 10px; 
            }  
          }@else if $name == fw {
              @if $i <= 8 {
                 .#{$name}-#{$i}{
                           #{$property}: $i * 100; 
                 }   
              }
            
          }@else{
               .#{$name}t-#{$i}{
              #{$property}-top: $i * 5px;
          }
            .#{$name}r-#{$i}{
                 #{$property}-right: $i * 5px;
          }
          .#{$name}b-#{$i}{
                 #{$property}-bottom: $i * 5px;
          }
          .#{$name}l-#{$i}{
                 #{$property}-left: $i * 5px;
          }
          .#{$name}y-#{$i}{
                 #{$property}: $i * 5px 0;
          }
          .#{$name}x-#{$i}{
             #{$property}: 0 $i * 5px; 
          }
          .#{$name}xy-#{$i}{
             #{$property}:$i * 5px; 
          }
          }
          
       }
   
       
   }
   
    @include basics(m,margin);  
    @include basics('p',padding);
    @include basics(fz,font-size);
    @include basics(hei,height);
    @include basics(wid,width);
    @include basics(lh,line-height);
    @include basics(fw,font-weight);
   
   .u-show{
       display: none;
   }
   .po-f{
       position: fixed;
       
   }
   .po-a{
       position: absolute;
   }
   .po-r{
       position: relative;
   }
   .po-s{
       position: static;
   }
   
   .ta-c {
       text-align: center;
   }
   .ta-r {
       text-align: right;
   }
   .ta-l{
       text-align: left;
   }
   .flex{
       display: flex;
       flex-direction: row;
        // flex-wrap:wrap; 
   
   }
   .j_sb{
       // 左右对齐
        justify-content: space-between;
         flex-wrap:wrap; 
   }
   .tb_style {
    padding: 0 4*5px;
    td {
        line-height: 22px;
        vertical-align: middle;
        font-size: 18px;
        padding: 1px;
    }
}
.overflow {
    overflow: auto;
}



   
   